{% extends 'home/public/base.html' %}

{% block css %}
<link rel="stylesheet" type="text/css" href="/static/home/css/member.css">
<link rel="stylesheet" type="text/css" href="/static/home/css/member-app.css">
{% endblock %}


{% block con %}
<!-- 主内容区域 -->
<div class="mainbody order">
    <div class="container">
        <!-- 面包屑导航 -->
        <div class="crumbs ">
            <ol class="breadcrumb">
                <li class="hidden-xs hidden-sm"><a href="index.html">首页</a></li>
                <li class="active"><a href="#">我的商城</a></li>
            </ol>
        </div><!-- 面包屑导航 E-->
        
        <div class="main clearfix">
            <!-- 左侧导航 -->
            <div class="left-nav f-fl hidden-xs hidden-sm">
                <div class="nav-main">
                    <a href="javascript:;" class="type-title"><span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>订单中心</a>
                    <a href="{% url 'myorder' %}" class="ml" >我的订单</a>

                    <a href="javascript:;" class="type-title"><span class="glyphicon glyphicon-user" aria-hidden="true"></span>个人中心</a>
                    <a href="{% url 'member' %}" class="ml " >地址管理</a>

                </div>
            </div><!-- 左侧导航 E-->
            <!-- 右侧内容展示 -->
            <div class="right-content f-fr col-xs-12 col-sm-12">
                <div class="index-main">
                    <!-- 个人信息 -->
                    <div class="top clearfix">
                        <div class="information clearfix f-fl col-xs-12 col-sm-12">
                            <div class="pic f-fl">
                              <img src="{{ userinfo.picurl }}" alt="">
                            </div>
                            <div class="name f-fl">
                                <span>{{ userinfo.username }}</span>
                                <span>欢迎您回来！</span>
                            </div>
                            <div class="info f-fl">
                                <ul>
                                    <li>Flyme账号：<span>{{ userinfo.username }}</span></li>
                                    <li>绑定手机号：<span>{{ userinfo.phone }}</span></li>
                                    <li class="emailText">绑定邮箱：<span>{{ userinfo.email }}</span></li>
                                </ul>
                                <a class="edit" href="{% url 'useredit' userinfo.id %}" >修改个人信息 &gt;</a>
                            </div> 
                        </div>
                        <div class="backCouponNum f-fl col-xs-12 col-sm-12">
                            <p>回购券：<span>0</span></p>
                        </div>
                    </div>
                    <!-- 地址管理 -->
                    <div class="middle clearfix">
                        <div class="title clearfix">
                            <span class="f-fl">地址管理</span><br>
                            <button class="btn btn-primary btn-xs" type="button" data-toggle="modal" data-target="#myModal">增加</button>
                        </div>
                        <div class="row">
                            <div class="col-md-10 col-md-offset-1">
                                <div class="row">
                                    {% for v in address %}
                                    <div class="col-md-3 address-items" aid="{{ v.id }}" ischecked="{{ v.status }}" {% if v.status == 1 %} style="border:2px solid red;margin-left:5px;margin-top:5px;" {% else %} style="border:2px  dashed black;margin-left:5px;margin-top:5px;" {% endif %} >
                                        <address astatus="{{ v.status }}" aid="{{ v.id }}">
                                            <br>
                                            <strong> 收货人:<span class='aname'>{{ v.aname }}</span></strong><br>
                                            收货地址:<span class="aads">{{ v.aads }}</span><br>
                                            <abbr  title="Phone">收货电话:<span class="aphone">{{ v.aphone }}</span></abbr><br>
                                            <button class="btn btn-primary btn-xs " onclick="editAdds(this)">修改</button>
                                            <a href="{% url 'addressdel' %}?aid={{ v.id }}">
                                                <button class="btn btn-primary btn-xs">删除</button>
                                            </a>
                                        </address>
                                        
                                    </div>
                                    {% endfor %}
                                    
                                </div>
                            </div>
                        </div>
                        <!-- Button trigger modal -->
                        <!-- Modal -->
                        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <form action="{% url 'addressadd' %}" method="post">
                                        {% csrf_token %}
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货人</label>
                                                <input type="text" name="aname"  class="form-control" placeholder="收货人">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货电话</label>
                                                <input type="text" name="aphone"  class="form-control" placeholder="收货电话">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货地址</label>
                                                <input type="text" name="aads"  class="form-control" placeholder="收货地址">
                                            </div>
                                            <div class="checkbox">
                                                <label >
                                                    <input type="checkbox"  name="status" value="1">是否设为默认地址
                                                </label>
                                            </div>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                            <button class="btn btn-primary">保存</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <!-- 编辑模态框  -->
                        <div class="modal fade" id="myModaledit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <form action="{% url 'addressedit' %}" method="post">
                                        {% csrf_token %}
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货人</label>
                                                <input type="text" name="aname" id="aname" class="form-control" placeholder="收货人">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货电话</label>
                                                <input type="text" name="aphone" id="aphone" class="form-control" placeholder="收货电话">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">收货地址</label>
                                                <input type="text" name="aads" id="aads" class="form-control" placeholder="收货地址">
                                            </div>
                                            <div class="checkbox">
                                                <label >
                                                    <input type="checkbox" name="status" id="status" value="1">是否设为默认地址
                                                </label>
                                            </div>
                                            <input type="hidden" name="aid" id="aid">

                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                            <button class="btn btn-primary ">保存</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 地址管理E -->
                    <div class="bottom clearfix">
                        <div class="orderState f-fl col-xs-12 col-sm-12">
                            <div class="title clearfix">
                                <span class="f-fl">订单状态</span>
                                <a class="detail f-fr" href="#">查看全部订单 &gt;</a>
                            </div>
                            <div class="content">
                                <div class="waitPay clearfix">
                                    <span class="f-fl cercl">
                                        <span class="glyphicon glyphicon-folder-open iconfont" aria-hidden="true"></span>
                                    </span>
                                    <div class="text f-fl">
                                        <p>待付款订单：<span class="num">0</span></p>
                                        <a class="detail" href="#">查看全部待付款订单 &gt;</a>
                                    </div>
                                </div>
                                <div class="waitDeliver clearfix">
                                    <span class="f-fl cercl">
                                        <span class="glyphicon glyphicon-folder-close iconfont" aria-hidden="true"></span>
                                    </span>
                                    <div class="text f-fl">
                                        <p>待发货订单：<span class="num">0</span></p>
                                        <a class="detail" href="#">查看全部待发货订单 &gt; </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="message f-fl col-xs-12 col-sm-12">
                            <div class="title clearfix">
                                <span class="f-fl">活动消息</span>
                                <a class="f-fr detail" href="#">查看全部消息 &gt;</a>
                            </div>
                            <div id="tableList" class="list J_no_data"><span>您暂无此类消息提醒！</span></div>
                        </div>
                    </div>
                </div>

                
            </div>
        </div>
    </div>  
</div>
<!-- 主内容区域 E-->


{% endblock %}


{% block js %}
<script type="text/javascript">

//回顶部
backTop();
//顶部导航鼠标经过出现内容
topNav();
//登录图片鼠标经过
topLogin();



// 编辑模态框读取数据
function editAdds(obj){  

    var aname = $(obj).parent().find('.aname').text();
    var aads = $(obj).parent().find('.aads').text();
    var aphone = $(obj).parent().find('.aphone').text();
    var status = $(obj).parent().attr('astatus')
    var aid = $(obj).parent().attr('aid')

    $('#aname').val(aname)
    $('#aads').val(aads)
    $('#aphone').val(aphone)
    if (status == 0){
        document.getElementById('status').checked = false;
    }else{
        document.getElementById('status').checked = true;
    }
    $('#aid').val(aid)
  
    $('#myModaledit').modal('show');    
} 



</script>
{% endblock %}